<template>
        <div>
            <h3>成绩等级 --- {{ score }}</h3>
            <div v-if="score>=90">优秀</div>
            <div v-else-if="score>=80">良好</div>
            <div v-else-if="score>=60">及格</div>
            <div v-else>不及格</div>
    
            <h3>v-show演示</h3>
            <div v-show="score>=90">优秀</div>
            <!--<div v-show="score>=80">良好</div>-->
        </div>
    </template>
    <script setup>
    import { ref } from 'vue'
    //条件渲染根据不同的成绩在页面中渲染出等级
    
    let score = ref(80)
    
    //v-if else-if else 会动态的创建或销毁元素
    </script>
    <style scoped>
    </style>